<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="title">
    <div id="father"></div>
</div>

</body>
<script type="text/javascript" src="/webjars/jquery/3.1.1/jquery.js"></script>
<script>
    $(function () {
        $.ajax({
            type:"post",
            url:"/findAll",
            data:{
            },
            async:true,
            dataType:"json",
            success:function (data) {
                /*$.each(data,function (index,item) {
                    var text="<div><p>"+item.id+"</p>"
                    text+="<p>"+item.nickname+"</p>"
                    text+="<p>"+item.content+"</p>"
                    text+="<button id='rep'>回复</button>"
                    text+="<div id=\"son\">aa</div>"
                    text+="<div>===========================================</div></div>"

                })*/
                /*var num=data.num*/
                $.each(data,function (index,item) {
                    var text="<div><p>"+item[0].id+"</p>"
                    text+="<p>"+item[0].nickname+"</p>"
                    text+="<p>"+item[0].content+"</p>"
                    text+="<button id='rep'>回复</button>"
                    text+="<div id=\"son\">"+item[1].parentid+"</div>"
                    text+="<div>"+item[1].content+"</div>"
                    text+="<div>===========================================</div></div>"
                    $("#title").append(text)
/*                    console.log("===========================================")
                    console.log(item[0].id)
                    console.log(item[0].nickname)
                    console.log(item[0].content)
                    console.log(item[1].parentid)
                    console.log(item[1].content)
                    console.log(item[2].parentid)
                    console.log(item[2].content)
                    console.log("===========================================")*/

                })
            }
        },JSON)

        $("#id")

        $(document).on("click","#rep",function () {
            console.log($(this).parent().children().html())
            var text=$(this).parent().children().eq(4)
            console.log(text.text())
            $.ajax({
                type:"post",
                url:"/reply",
                data:{
                    id:$(this).parent().children().html()
                },
                async:true,
                dataType:"json",
                success:function (data) {
                    $.each(data,function (index,item) {
                        console.log(item)
                        console.log(item.parentid)
                        console.log(item.content)
                        var tex="<p>"+item.parentid+"</p>"
                        tex+="<p>"+item.content+"</p>"
                        text.append(tex)
                    })
                }
            },JSON)
        })

    })
</script>
</html>